<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Insert title here</title>
        <jsp:include page="/view/taglib.jsp"></jsp:include>
    </head>
    <body>
        <div class="easyui-layout" data-options="fit:true">
            <div data-options="region:'north',split:true,border:false" style="height:80px;">
                <form id="searchForm">
                    <table>
                        <tr>
                            <td><a id="btn_add" class="easyui-linkbutton" data-options="group:'g1',iconCls:'icon-add'">添加</a></td>
                            <td><a id="btn_dele" class="easyui-linkbutton" data-options="group:'g1',iconCls:'icon-remove'">删除</a></td>
                            <td><a onclick="grid.datagrid('reload');" href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'ext-icon-arrow_refresh'">刷新</a></td>
                        </tr>
                    </table>
                    <table>
                        <tr>
                            <td>用户名称</td>
                            <td><input name="user_nameSch" class="textbox" style="width: 120px; height: 22px;" /></td>
                            <td>创建时间</td>
                            <td><input name="createdStartSch" class="easyui-datebox" style="width: 100px" />
                                -
                                <input name="createdEndSch" class="easyui-datebox" style="width: 100px" />
                            </td>
                            <td><a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'ext-icon-zoom',plain:true" onclick="grid.datagrid('load',fw.serializeObject($('#searchForm')));">过滤</a> <a href="javascript:void(0);" id="reset_searchFilter" class="easyui-linkbutton" data-options="iconCls:'ext-icon-zoom_out',plain:true" onclick="$('#searchForm input').val('');grid.datagrid('load',{});">重置过滤</a></td>
                        </tr>
                    </table>
                </form>
            </div>
            <div data-options="region:'center',border:false">
                <table id="grid">
                </table>
            </div>
            <div data-options="region:'east',split:true,border:false" style="width: 50%; padding: 5px;">
                <form id="form" name="form" method="post" class="form">
                    <fieldset>
                        <legend> 基本信息--<span id="operateMode_title">添加模式</span> </legend>
                        <table class="table">
                            <tbody>
                                <tr style="display: none;">
                                    <th>id</th>
                                    <td><input id="id" readonly="readonly" name="id" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                <tr>
                                    <th>用户名</th>
                                    <td><input id="username" name="username" class="textbox"  required = "required"   style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                <tr>
                                    <th>密码</th>
                                    <td><input id="password" name="password" class="textbox"  required = "required"   type="password"    style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>添加时间</th>
                                    <td><input id="addTime" name="addTime" data-options="disabled:true" class="easyui-datetimebox"  style="width: 180px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>最后登录时间</th>
                                    <td><input id="lastLoginDate" name="lastLoginDate" data-options="disabled:true" class="easyui-datetimebox"  style="width: 180px;" /></td>
                                </tr><!-- 
                                                                                                                                                                                                                                                                <tr>
                                    <th>用户角色</th>
                                    <td><input id="roleProperty"  name="roleProperty" class="textbox"  required = "required"   style="height: 22px;" /></td>
                                </tr> -->
                                                                                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>姓名</th>
                                    <td><input id="trueName" name="trueName" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>公司</th>
                                    <td><input id="company" name="company" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>职务</th>
                                    <td><input id="position" name="position" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>电话</th>
                                    <td><input id="phone" name="phone" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>地址</th>
                                    <td><input id="address" name="address" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>QQ</th>
                                    <td><input id="qq" name="qq" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>微信</th>
                                    <td><input id="weixin" name="weixin" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                                                                                                                                                                                                                                                                                                                                                                                                <tr>
                                    <th>部门</th>
                                    <td><input id="department" name="department" class="textbox"      style="height: 22px;" /></td>
                                </tr>
                               <!--  <tr>
									<th>选择图片</th>
									<td>
									<select class="selectFiles"><option>选择图片</option></select> 
										<a href="#" class="easyui-linkbutton uploader" data-options="iconCls:'icon-add'">  </a> 
										<input name="picId" class="selectFilesValue" type="hidden" />
										</td>
								</tr> -->
                                                                                                                                                                                                <th>操作</th>
                                <td><a id="operateMode_submit" class="easyui-linkbutton" data-options="iconCls:'icon-save'">确定</a> <a id="operateMode_reset" class="easyui-linkbutton" data-options="iconCls:'icon-reload'">重置</a></td>
                                </tr>
                            </tbody>
                        </table>
                    </fieldset>
                </form>
            </div>
        </div>
        <script type="text/javascript">
            $("#id").attr("value", 0);
            
            loadfile();
          //绑定上传按钮功能
            $(".uploader").on('click', uploaderFun);
           function loadfile(){
            //先对所有uploader的class对象进行遍历
            $(".uploader")
                .each(function () {
                    var selectObj = $(this)
                        .prev('.selectFiles');
                    var options = "";
                    //如果该文件选择器有值，则进行异步数据获取
                    if ($(this)
                        .next('.selectFilesValue')
                        .val()
                        .trim()
                        .length != 0) {
                        var ids = $(this)
                            .next('.selectFilesValue')
                            .val();
                        $.ajax({
                                type: "POST",
                                url: ctx + "findSysUploadByIds.do",
                                data: {
                                    ids: ids
                                }
                            })
                            .done(function (result) {
                                result = JSON.parse(result);
                                if (result.length > 0) {
                                    //对返回结果进行遍历，重组option选项，并将结果放置到相应的selectOption对象中去
                                    $(result)
                                        .each(function () {
                                            options += "<option>" + this.clientName + "</option>";
                                        })
                                    selectObj.html(options);
                                    selectObj.prepend("<option>选择文件(选中了 " + result.length + " 个)</option>");
                                }
                            })
                    } else {
                        selectObj.html("<option>选择文件</option>");
                    }
                });
        	
            }
        	 //选择文件部分的函数操作，需要将自身对象及ids列表作为参数进行传递
            function uploaderFun() {
                var btn = $(this);
                var ids = "";
                if ($(this)
                    .next()
                    .val()
                    .trim()
                    .length != 0) {
                    ids = "?ids=" + $(this)
                        .next()
                        .val();
                }

                if (ids.length > 0) {
                    url = "../../uploader.jsp"+"&moduleId=user&sysfuncId=avatar&dataId=userId";
                } else {
                    url = "../../uploader.jsp?moduleId=user&funcId=avatar&dataId=userId" 
                }

                var dialog = fw.modalDialog({
                    title: '选择文件',
                    url: url,
                    width: 700,
                    height: 500,
                    buttons: [{
                        text: '确认选择',
                        handler: function () {
                            dialog.find('iframe')
                                .get(0)
                                .contentWindow.submitForm(dialog, btn);
                        }
                    },  {
                        text: '关闭窗口',
                        handler: function () {
                            dialog.find('iframe')
                                .get(0)
                                .contentWindow.closeDialog(dialog);
                        }
                    }]
                });
        	 }
            
            
            
            $(function() {
                var gird;
                grid=$('#grid').datagrid({
                    fit:true,
                    border : false,
                    collapsible : false,
                    rownumbers : true,
                    pagination : true,
                    singleSelect : true,
                    rownumbers : true,
                    url:ctx+'listSUser.do',
                    columns:[[
                  		{ sortable:true,field:'id',title:'id'}             
            			,{ sortable:true,field:'username',title:'用户名'}
            		                       
            			,{ sortable:true,field:'addTime',title:'添加时间'}
            		                       
            			,{ sortable:true,field:'lastLoginDate',title:'最后登录时间'}
            		                       
            			,{ sortable:true,field:'roleProperty',title:'角色属性'}
            		                       
            			,{ sortable:true,field:'trueName',title:'姓名'}
            		                       
            			,{ sortable:true,field:'company',title:'公司'}
            		                       
            			,{ sortable:true,field:'position',title:'职务'}
            		                       
            			,{ sortable:true,field:'phone',title:'电话'}
            		                       
            			,{ sortable:true,field:'address',title:'地址'}
            		                       
            			,{ sortable:true,field:'qq',title:'QQ'}
            		                       
            			,{ sortable:true,field:'weixin',title:'微信'}
            		                       
            			,{ sortable:true,field:'department',title:'部门'}
            		                    ]],
                    onLoadSuccess : function(data) {
                        $('.iconImg').attr('src', fw.pixel_0);
                    },
                    onClickRow : function(index, row) {
                    	$("#form").form("reset");
                        $("#form").form("load", row);
                        $("#operateMode_title").html("修改模式");
                    }
                });
                
                $.getJSON(ctx+'listAllRRole.do',{ },function(parentsJson) {
                    $("#roleProperty").combobox({
            			data:parentsJson.rows,
            			valueField:'roleId',
            	         textField:'roleName',
            	        selected:parentsJson.rows[0],
            	        filter: function(q, row){
                    		var opts = $(this).combobox('options');
                    		return row[opts.textField].indexOf(q) == 0;
                    	}
            	})
            	});
                
                //添加操作
                $("#btn_add").click(function() {
                    $("#operateMode_title").html("添加模式");
                    $('#grid').datagrid("unselectAll");
                    $("#id").attr("value", 0);
                    $("#form").form("reset");
                })
            
                //删除操作
                $("#btn_dele").click(function() {
                    var rows = $('#grid').datagrid('getSelections');
                    if (rows <= 0) {
                        $.messager.show({
                            title : message.title.normal,
                            msg : message.grid_select,
                            timeout : message.timeout,
                            showType : message.showType
                        });
                    } else {
                        $.messager.confirm(message.title.askTitle, message.dele_comfirm, function(r) {
                            if (r) {
                                var idValue = $("#form input[name='id']").val();
                                $.post(ctx+"delSUser.do", {
                                    id : idValue
                                }, function(result) {
                                	
                                    if (result.success) {
                                        $.messager.show({
                                            title : message.title.normal,
                                            msg : message.dele_success,
                                            timeout : message.timeout,
                                            showType : message.showType
                                        });
                                        grid.datagrid('reload');
                                    } else {
                                        $.messager.show({
                                            title : message.title.normal,
                                            msg : message.dele_fail,
                                            timeout : message.timeout,
                                            showType : message.showType
                                        });
                                    }
                                }, 'json');
                                $("#btn_add").click();
                            }
                        });
                    }
                })
            
                //确认提交操作
                $("#operateMode_submit").click(function() {
                    var idValue = $("#form input[name='id']").val();
                    if ($('#form').form('validate')) {
                        if (idValue > 0) {
                            //修改
                            $('#password').val(faultylabs.MD5($.trim($('#password').val())));  
                            $.post(ctx+"updateSUser.do", fw.serializeObject($('form')), function(result) {
                                if (result.success) {
                                	console.log(result);
                                    $.messager.show({
                                        title : message.title.normal,
                                        msg : message.update_success,
                                        timeout : message.timeout,
                                        showType : message.showType
                                    });
            
                                    grid.datagrid("reload");
            
                                    //重新获取form信息内容
                                    $("#form").form("load", ctx+"getSUserById.do?id=" + idValue);
                                }
                            }, 'json');
                        } else {
                            if(idValue.trim().length == 0){
                                $.messager.show({
                                    title : message.title.normal,
                                    msg : message.add_button_click,
                                    timeout : message.timeout,
                                    showType : message.showType
                                });
                            }else{
                                //添加
                                	$('#password').val(faultylabs.MD5($.trim($('#password').val())));  
                                	$.post(ctx+"addSUser.do", fw.serializeObject($('form')), function(result) {
                                		console.log(result);
                                	
                                		
                                    if (result.success) {
                                    	console.log(result);
                                        $.messager.show({
                                            title : message.title.normal,
                                            msg : message.add_success,
                                            timeout : message.timeout,
                                            showType : message.showType
                                        });
                                        grid.datagrid("reload");
                                        $("#form").form("reset");
                                    }
                                    else
                                    {
                                    	 $.messager.show({
                                             title : message.title.normal,
                                             msg : result.message,
                                             timeout : message.timeout,
                                             showType : message.showType
                                         });
                                    	
                                    }
                                }, 'json');
                            }
                        }
                    }
                })
                //重置操作
                $("#operateMode_reset").click(function() {
                    var idValue = $("#form input[name='id']").val();
                    if (idValue > 0) {
                        $("#form").form("load",ctx+"getSUserById.do?id=" + idValue);
                    } else {
                        $("#form").form("reset");
                    }
                })
            });
        </script>
    </body>
</html>